寫著寫這剛好已經第7天滿一週了，沒想到我意外寫了7天，不過先說一下預計，寫的內容會採取不連貫為主方式，我就

是任性想寫啥就寫啥(O

好吧我們就直接進入範例看一下MAP的使用方式

編譯前
$font-weights: (
  'regular': 400,
  'medium': 500,
  'bold': 700,
);

.ex1 {
  font-weight: map-get($font-weights, 'medium');
}

.ex2 {
  font-weight: map-get($font-weights, 'extra-bold');
}

編譯後
.ex1 {
  font-weight: 500;
}

今天上面那個範例，如果看了官網直接只用囉，map.get($font-weights, 'medium')，就覺得WTF為啥編譯不出

來，我不是看官網你騙我編譯不出來，正確用法應該是要用map-get($font-weights, 'medium')，

才可以正常編譯出來，好了進入這個範例，很簡單用法用了有一個＄font-weights利用裡面的key，拿到我們所需要

的值

編譯前
$light-weights: (
  'lightest': 100,
  'light': 300,
);
$heavy-weights: (
  'medium': 500,
  'bold': 700,
);

$group: map-merge($light-weights, $heavy-weights);

.ex3 {
  font-weight: map-get($group, 'bold');
}

編譯後
.ex3 {
  font-weight: 700;
}

上面這個範例是map另外一個用法，map-merge，他可以把兩個map合併成同一個map，可以一起使用合併再一起的

使用，然後map也可以使用裡面的name值，透過可能一些迴圈方式，產生出一些我們自己設定的class，和我們需要的

值，下面我們以一個範例來說明，這樣透過value和name達成客制管理需求

group，承接上面那個一個merge之後的值

@each $name, $value in $group {
  .font__#{$name} {
    font-weight: $value;
  }
}

.font__lightest {
  font-weight: 100;
}

.font__light {
  font-weight: 300;
}

.font__medium {
  font-weight: 500;
}

.font__bold {
  font-weight: 700;
}